<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{{ asset('tool/layui/css/layui.css') }}">
    <script src="{{ asset('tool/js/jquery.min.js') }}"></script>
    <script src="{{ asset('tool/layui/layui.js') }}"></script>
    <title>报修单</title>
</head>
<body>
<div class="layui-fluid" style="margin-top: 30px">
    <div class="layui-row">
        <form class="layui-form" action="" method="post" enctype="multipart/form-data">
            <input type="hidden" name="_token" value="{{ csrf_token() }}">
            <div class="layui-form-item">
                <label class="layui-form-label">报修项目</label>
                <div class="layui-input-block">
                    <input type="text" name="order_name" lay-verify="required"  placeholder="请输入报修项目" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">报修场所</label>
                <div class="layui-input-block">
                    <input type="text" name="maintain_site" lay-verify="required" placeholder="请输入报修场所" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">报修内容</label>
                <div class="layui-input-block">
                    <textarea name="apply_content" lay-verify="required" placeholder="请输入内容" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="layui-form-item layui-form-text">
                <input type="hidden" name="file" id="file" value="">
                <label class="layui-form-label"><span class="x-red">*</span>图片</label>
                <div class="layui-input-block">
                    <button type="button" class="layui-btn" id="upload">
                        <i class="layui-icon">&#xe67c;</i>上传图片
                    </button>
                </div>
                <div class="layui-input-block" id="filename">

                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    layui.use(['form', 'layer', 'upload'], function() {
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer,
            upload = layui.upload;

        upload.render({
            elem: '#upload'
            ,url: "/upload"
            ,field: 'file'
            ,size: 0
            ,multiple: true
            ,number: 3
            ,done: function(res){
                if (res.code != 0){
                    layer.msg('上传失败')
                }else {
                    $('#file').val($('#file').val() + '|' + res.data.src);
                    $('#filename').append('<img src="' + res.data.src + '" height="50"/>');
                    layer.msg('上传成功')
                }
            }

        });

        form.on('submit(add)', function(data) {
            console.log(data)

            console.log(data.field)
            data.field.file = $('#file').val();
            $.post("/maintain-order-add",data.field,function (res) {
                console.log(res);
                if (res.code != 0){
                    layer.msg(res.msg);
                }else {
                    layer.msg("提交成功", {icon: 6,time: 1500}, function() {
                        window.location.href = "/maintain-order";
                    });
                }
            });
            return false;
        });
    });
</script>
</body>
</html>
